<template>
  <div class="app-container">
    <p>Answer</p>
    <button @click="button1">start</button>
    <button v-if="!isRec" @click="startToRec">録音開始</button>
    <button v-else @click="EndToRec">録音停止</button>
    <p>Let`s speaking!</p>
  </div>
</template>
<script>
import { defineComponent, onMounted, reactive, toRefs } from "vue";
import { recReq, recStart } from "../../utils/video";
import RecordApp from "recorder-core/src/app-support/app";
import router from "../../router";
import { getFileUrl } from "../../api/oss";
export default defineComponent({
  setup() {
    const state = reactive({
      isRec: false,
    });
    const button1 = () => {
      recReq();
    };
    const startToRec = () => {
      state.isRec = true;
      recStart(!state.rec);
    };
    const EndToRec = () => {
      state.rec = false;
      RecordApp.Stop(
        function (blob, duration) {
          getRecItem("已录制", "", {
            blob: blob,
            duration: duration,
            rec: RecordApp.GetStopUsedRec(),
          });
        },
        function (msg) {
          console.log(msg);
        }
      );
      router.push("/wave");
    };
    const getFileId = () => {
      let chars = [
        "0",
        "1",
        "2",
        "3",
        "4",
        "5",
        "6",
        "7",
        "8",
        "9",
        "A",
        "B",
        "C",
        "D",
        "E",
        "F",
        "G",
        "H",
        "I",
        "J",
        "K",
        "L",
        "M",
        "N",
        "O",
        "P",
        "Q",
        "R",
        "S",
        "T",
        "U",
        "V",
        "W",
        "X",
        "Y",
        "Z",
        "a",
        "b",
        "c",
        "d",
        "e",
        "f",
        "g",
        "h",
        "i",
        "j",
        "k",
        "l",
        "m",
        "n",
        "o",
        "p",
        "q",
        "r",
        "s",
        "t",
        "u",
        "v",
        "w",
        "x",
        "y",
        "z",
      ];
      let nums = "";
      for (let i = 0; i < 16; i++) {
        //这里是几位就要在这里不改变
        let id = parseInt(Math.random() * 61);
        nums += chars[id];
      }
      return nums;
    };
    const getRecItem = (msg, color, result) => {
      let fileName=getFileId()+".wav"
      // window.localStorage.setItem("waveResult",JSON.stringify(Object.assign(result,{fileSrc:`/sound/download/${fileName}`})))
      // var downA = document.createElement("A");
      // downA.href = (window.URL || webkitURL).createObjectURL(result.blob);
      // downA.download = fileName;
      // downA.click();
      let reader = new FileReader();
      reader.onloadend = function () {
        sentNet(reader.result,fileName);
      };
      reader.readAsDataURL(result.blob);
      window.localStorage.setItem("fileName",fileName)
      router.push("/wave");
    };
    const sentNet =(res,fileName) => {
      getFileUrl(res.substring(res.indexOf(",") + 1, res.length),fileName).then(res=>{
console.log("下方打印后台响应")
      console.log(netres)
      debugger;
      })
      
    };
    return {
      ...toRefs(state),
      EndToRec,
      startToRec,
      button1,
    };
  },
});
</script>
